import { BasicColumn, FormSchema, TableAction, useTable } from "@/components/Table";
import BasicTable from "@/components/Table/BasicTable";
import Recipe from "./components/recipe/index";
import { useDrawer } from "@/components/Drawer";
import { useTranslation } from "react-i18next";
import { useEffect, useState } from "react";
import { drugInfoApi } from "@/api/erp/drug/drugCatalogue";
import { treatmentPhmPage } from "@/api/MedicalExamination";

const index = () => {
	const { t } = useTranslation();
	const [drugsList, setDrugsList] = useState<any>([]);
	const searchFormSchema: FormSchema[] = [
		{
			label: t("felix_ui.drugName"),
			field: "drugName",
			component: "Input"
		}
	];
	const columns: BasicColumn[] = [
		{
			title: t("flandre_ui.drug_id"),
			dataIndex: "drugId",
			render: (drugId: string) => {
				const drug = drugsList.find((item: any) => item.drugId == drugId);
				return drug ? drug.drugName : "";
			}
		},
		{
			title: t("felix_ui.drugName"),
			dataIndex: "drugName"
		},
		{
			title: t("flandre_ui.active_ingredient"),
			dataIndex: "activeIngre"
		},
		{
			title: t("flandre_ui.unit_name"),
			dataIndex: "unitName"
		},
		{
			title: t("felix_ui.dt_date"),
			dataIndex: "timesPerDay"
		},
		{
			title: t("felix_ui.dosePerTime"),
			dataIndex: "dosePerTime"
		},
		{
			title: t("felix_ui.drugTakenMode"),
			dataIndex: "drugTakenMode"
		},
		{
			title: t("felix_ui.quantity"),
			dataIndex: "drugCount"
		},
		{
			title: t("felix_ui.amount"),
			dataIndex: "salePrice"
		},
		{
			title: t("system.user.action"),
			dataIndex: "action",
			fixed: "right",
			render: (_, record: any) => (
				<TableAction
					actions={[
						{
							label: t("MedicalExamination.check"),
							onClick: handleRole(record)
						}
					]}
				></TableAction>
			)
		}
	];
	const [registerDrawer, { openDrawer }] = useDrawer();

	const [registerTable, { reload }] = useTable({
		api: treatmentPhmPage,
		columns,
		useSearchForm: true,
		formConfig: {
			schemas: searchFormSchema,
			showActionButtonGroup: true,
			baseColProps: { span: 8 },
			actionColOptions: { span: 24 }
		},
		beforeFetch: (params: any) => {
			return { ...params, trtmtType: 1 };
		}
	});

	/** Function  */

	const handleRole = (record: Recordable) => () => {
		openDrawer(true, {
			...record
		});
	};
	const getDrugsList = async () => {
		const res = await drugInfoApi.drugsList({});
		setDrugsList(res.list);
	};
	useEffect(() => {
		getDrugsList();
	}, []);
	return (
		<div className="recipe">
			<BasicTable register={registerTable}></BasicTable>
			<Recipe register={registerDrawer} success={reload}></Recipe>
		</div>
	);
};
export default index;
